<!--
2D转换之：缩放
    transform: scale(x,y);
        - 缩放的是宽、高
        - x、y是倍数，不加单位
        - 只写一个参数时，默认是等比例缩放的：scale(2)等同于scale(2,2)
        - 可以设置中心点缩放
        - 不影响其它盒子
应用场景
    1）放大镜
    2）跳动的心脏
    3）热点图（闪烁光点）
提示：2）3）用动画去实现更合适
-->
<style>
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  div {
    width: 200px;
    height: 200px;
    margin: 100px auto;
    background-color: cyan;
    transition: all 0.5s;
    transform-origin: right top;
  }
  div:hover {
    /* transform: scale(1.5); */
    transform: scale(1.5, 2);
  }
</style>

<div></div>
